<template>
	<div>
		<div class="image-view" v-long-touch="longTouchQrcode">
			<!-- <img src="https://wanzimy.oss-cn-hangzhou.aliyuncs.com/upload/2024-01-15/pSdqHfvVFf.png"/> -->
			<div style="width: 100vw;
    height: 100vh;
    background-image: url('https://wanzimy.oss-cn-hangzhou.aliyuncs.com/upload/2024-01-15/pSdqHfvVFf.png');
    position: relative;
    background-size: 100% 100%;"></div>
		</div>
		<van-popup v-model="show" round position="bottom" :style="{ height: '25%' }">
			<div class="des" style="color: rgb(195, 193, 195);padding: 30px 0;text-align: center;"> 点击打开对方的企业微信名片 </div>
			<div class="ls" style="width: 100%;padding-bottom: 33px;text-align: center;border-bottom: 15px solid #f9f9fc; font-size: 16px;" @click="jump">
				<span>全国连锁-私人定制</span>
				<span style="color: rgb(235, 205, 88); margin-left: 5px;">@老师</span>
			</div>
			<div class="qx" style="text-align: center;    padding: 20px 0;    font-size: 17px;" @click="cancel">
				<span>取消</span>
			</div>
		</van-popup>
	</div>
</template>
<script>
import { clickIdKeys } from '@/config'
import { Popup } from 'vant';
import longTouch from "@/directives/long-touch";
export default {
	name: 'image-view',
	directives: {
		longTouch,
	},
	props: {
		view: {
			type: Object,
			default: () => ({}),
		},
	},
	data() {
		return {
			show: false
		};
	},
	computed: {
		options() {
			return this.view.options
		},
		images() {
			return this.options.images || []
		},
		extQueryId() {
			const { query } = this.$route
			let url = ''

			for (let key in query) {
				if (clickIdKeys.includes(key)) {
					url = url + `&${key}=${query[key]}`
				}
			}

			return url
		},
	},
	methods: {
		longTouchQrcode(ev) {
			var ua = navigator.userAgent.toLowerCase();
			var isWeixin = ua.indexOf('micromessenger') != -1;
			if (isWeixin) {
				return true;
			}else{
				this.show = true
			}
			// const { click_type, is_dialog } = this.options;

			// if (click_type == 1) {
			// 	if (is_dialog == 1) {
			// 		this.show = true;
			// 	}
			// 	else {
			// 		this.skipAdMp(this.options)
			// 	}
			// }
			// return;
		},
		cancel() {
			this.show = false
		},
		jump() {
			this.skipAdMp(this.options);
		}
	}
}
</script>
<style lang="scss" scoped>
.image-view {
	min-height: 50px;
	img {
		width: 100%;
		vertical-align: middle;
		font-size: 0;
	}
}
.dialog-actions {
    display: flex;
    overflow: hidden;
    .confirm,
    .cancel {
      flex: 1;
      margin: 0;
      border: 0;
      font-size: 0.41111rem;
    }
    .cancel,
    .cancel:active {
      color: #909399;
    }
    .confirm,
    .confirm:active {
      color: #ee0a24;
    }
  }
</style>
